<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/common/include/page.jsp" %>
<!-- 如何new一个对象 -->
<jsp:useBean id="dynastyPOJO" class="com.carlinfo.demo.pojo.ADynasty"/>
<!DOCTYPE HTML>
<html>
	<head>
		<title>更新朝代 - 用户中心</title>
		<%@ include file="/common/include/title.jsp" %>
		<meta name="keywords"
			content="H-ui.admin v3.1,H-ui网站后台模版,后台模版下载,后台管理系统模版,HTML后台模版下载">
		<meta name="description"
			content="H-ui.admin v3.1，是一款由国人开发的轻量级扁平化网站后台模板，完全免费开源的网站后台管理系统模版，适合中小型CMS后台系统。">
		<!--请在下方写此页面业务相关的脚本-->
		<script type="text/javascript"
			src="${rootPath }/common/resource/H-ui.admin/lib/jquery.validation/1.14.0/jquery.validate.js"></script>
		<script type="text/javascript"
			src="${rootPath }/common/resource/H-ui.admin/lib/jquery.validation/1.14.0/validate-methods.js"></script>
		<script type="text/javascript"
			src="${rootPath }/common/resource/H-ui.admin/lib/jquery.validation/1.14.0/messages_zh.js"></script>
	</head>
	<body>
		${requestScope.dynasty }--->
		<article class="page-container">
			<form class="form form-horizontal" id="form-admin-add">
				<!-- 要把id带上去,如果不带就不知道更新的是哪个 -->
				<input type="hidden" name="id" value="${requestScope.dynasty.id }">
				<div class="row cl">
					<label class="form-label col-xs-4 col-sm-3"><span
						class="c-red">*</span>名字：</label>
					<div class="formControls col-xs-8 col-sm-9">
						<input type="text" class="input-text" value="${requestScope.dynasty.name }" placeholder=""
							id="name" name="name">
					</div>
				</div>
				<div class="row cl">
					<label class="form-label col-xs-4 col-sm-3"><span
						class="c-red">*</span>首都：</label>
					<div class="formControls col-xs-8 col-sm-9">
						<input type="text" class="input-text" value="${requestScope.dynasty.capital }" placeholder=""
							id="capital" name="capital">
					</div>
				</div>
				<div class="row cl">
					<label class="form-label col-xs-4 col-sm-3"><span
						class="c-red">*</span>年龄：</label>
					<div class="formControls col-xs-8 col-sm-9">
						<input type="text" class="input-text" value="${requestScope.dynasty.age }" placeholder=""
							id="age" name="age">
					</div>
				</div>
				<div class="row cl">
					<label class="form-label col-xs-4 col-sm-3"><span
						class="c-red">*</span>开国时间：</label>
					<div class="formControls col-xs-8 col-sm-9 skin-minimal">
						<input type="text" class="input-text Wdate" value="<fmt:formatDate value="${requestScope.dynasty.st }" pattern="yyyy-MM-dd HH:mm:ss"/>" placeholder=""
							id="st" name="st" readonly="readonly"
							onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss'})">
					</div>
				</div>
				<div class="row cl">
					<label class="form-label col-xs-4 col-sm-3"><span
						class="c-red">*</span>发布时间：</label>
					<div class="formControls col-xs-8 col-sm-9">
						<input type="text" class="input-text Wdate" value="<fmt:formatDate value="${requestScope.dynasty.pubTime }" pattern="yyyy-MM-dd HH:mm:ss"/>" placeholder=""
							id="pubTime" name="pubTime" readonly="readonly"
							onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss'})">
					</div>
				</div>
				<div class="row cl">
					<label class="form-label col-xs-4 col-sm-3"><span
						class="c-red">*</span>状态：</label>
					<div class="formControls col-xs-8 col-sm-9">
						<c:forEach items="${dynastyPOJO.statusMap}" var="me" varStatus="stat">
							<label for="status${me.value.value }">
								<!-- 目前:状态应该是数据库里面选中的效果 -->
								<input type="radio" value="${me.value.value }" placeholder=""
									${me.value.value == requestScope.dynasty.status ? 'checked' : '' }
									id="status${me.value.value }" name="status">${me.value.info}
							</label>
						</c:forEach>
					</div>
				</div>
				<div class="row cl">
					<label class="form-label col-xs-4 col-sm-3">内容：</label>
					<div class="formControls col-xs-8 col-sm-9">
						<textarea name="context" id="context" cols="" rows="" class="textarea"  placeholder="说点什么...最少输入10个字符" datatype="*10-100" dragonfly="true" nullmsg="备注不能为空！" onKeyUp="$.Huitextarealength(this,200)">${requestScope.dynasty.context }</textarea>
						<p class="textarea-numberbar"><em class="textarea-length">0</em>/200</p>
					</div>
				</div>
				<div class="row cl">
					<div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
						<input class="btn btn-primary radius" type="submit"
							value="&nbsp;&nbsp;提交&nbsp;&nbsp;">
					</div>
				</div>
			</form>
		</article>
	
		<script type="text/javascript">
			$(function() {
				$('.skin-minimal input').iCheck({
					checkboxClass : 'icheckbox-blue',
					radioClass : 'iradio-blue',
					increaseArea : '20%'
				});
				/* 此是对表单进行验证
					js对表单的验证要想工作起来得注意以下几点:
					~表单的id不能随便写,必须和$("#")一样
					~表单里面有好多控件:
				*/
				$("#form-admin-add").validate(
					{
						/* role:角色,rule:规则 */
						rules : {
							/* adminName:指的是控件的name和id;最好保持一致 */
							adminName : {
								/* 必须 */
								required : true,
								/* 最小长度 */
								minlength : 4,
								/* 最大长度 */
								maxlength : 16
							},
							password : {
								required : true,
							},
							password2 : {
								required : true,
								/* 两次密码一样 */
								equalTo : "#password"
							},
							sex : {
								required : true,
							},
							phone : {
								required : true,
								isPhone : true,
							},
							email : {
								required : true,
								/* 验证邮箱吧;邮箱的正则表达式,不用你写了 */
								email : true,
							},
							adminRole : {
								required : true,
							},
							name : {
								/* 必须 */
								required : true,
								/* 最小长度 */
								minlength : 2,
								/* 最大长度 */
								maxlength : 20
							},
							capital : {
								/* 必须 */
								required : true,
								/* 最小长度 */
								minlength : 2,
								/* 最大长度 */
								maxlength : 20
							},
							age : {
								/* 必须 */
								required : true,
								/* 最小长度 */
								minlength : 1,
								/* 最大长度 */
								maxlength : 20,
								number : true,
							},
						},
						onkeyup : false,
						focusCleanup : true,
						success : "valid",
						submitHandler : function(form) {
							/* ajax: */
							$(form).ajaxSubmit(
							{
								type : 'post',
								url : "${rootPath}/back/DemoBackServlet?method=dynastyUpdateSubmit",
								/* 信的内容已经默认的会将表单中所有的控件提交给服务器 */
								success : function(data) {
									//console.info(data + "------>" + data.info)
									/* data:表示服务器返回的内容
									返回的是Service返回的JSON,直接拿过来使用*/
									layer.msg(data.info,
									{
										icon : 1,
										time : 5000
									},function()
									{
										/* 关闭当前的选项卡 */
										var index = parent.layer
												.getFrameIndex(window.name);
										parent.$('.btn-refresh').click();
										/* 模拟点击了一下刷新按钮 */
										parent.$('.btn-success').click();
										parent.layer.close(index);
									});
								},
								error : function(
										XmlHttpRequest,
										textStatus,
										errorThrown) {
									layer
											.msg(
													'error!',
													{
														icon : 1,
														time : 1000
													});
								},
								"dataType":"json"
							});
						}
					});
			});
		</script>
		<!--/请在上方写此页面业务相关的脚本-->
	</body>
</html>